<template>
  <div id="app">
  

    <router-view></router-view>


  
    
  </div>
</template>

<script>

export default {
  name: 'App',
//   data(){
//     return{
//       currentIndex:0,
//     }
//   },
  
//   methods:{
//        btn(index){
//         console.log(index);
//         this.btnsIndex=index
//        }
//       },
}
</script>

<style>
*{
    margin: 0;
    padding: 0;
  }
 html{
  height: 100%;
 }
 #app{
  height: 100%;
 }
  .tabbar{
    position:fixed;
    bottom: 0%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 600px;
    height: 50px;
    background-color: white;
    font-size: 14px;
  }
  .active{
    color: lightcoral;
  }
  a{
    color: black;
    text-decoration: none;
  }
  a.router-link-active{
    color: red;
  }
  .v-enter{
    opacity: 0;
  }
  .v-enter-active{
  transition: all 1s;
  }
  .v-leave{
    opacity: 1;
  }
</style>
